<template>
  <el-drawer
    :title="title"
    :visible.sync="dialogVisible"
    direction="rtl"
    size="80%"
    :show-close="false"
  >
    <div class="drawerd">
      <div class="btn-sticky">
        <el-button
          type="primary"
          size="mini"
          class="u-m-l-10"
          @click="reset_passwords"
          v-if="mode === 'editrenyuanxinxi_from'"
          >重置密码</el-button
        >
        <el-button
          type="primary"
          size="mini"
          class="u-m-l-10"
          @click="leave_office"
          v-if="mode === 'editrenyuanxinxi_from'"
          >离职</el-button
        >
        <el-button type="primary" size="mini" class="u-m-l-10" @click="subim"
          >保存</el-button
        >
        <el-button
          type="primary"
          size="mini"
          class="btn-stop-use"
          v-throttle="() => $emit('cancel')"
          >返回</el-button
        >
      </div>

      <Tab1 :mode="mode" ref="tab1" />
    </div>
  </el-drawer>
</template>

<script>
import Tab1 from "./tbas/tab1.vue";

export default {
  components: {
    Tab1,
  },
  props: {
    mode: {
      type: String,
    },
  },
  data() {
    return {
      dialogVisible: true,
      activeName: "1",
      title: "",
    };
  },
  methods: {
    // 提交成功
    sendOrdersSuccess() {
      this.$notify.success({
        title: "消息",
        message: "保存成功",
        position: "bottom-right",
      });
      this.$emit("done");
    },
    //提交
    subim() {
      let refs = this.$refs;
      if (!refs.tab1.verify_required()) return; //验证tab1必填项
      let bigObj = {
        tab1: refs.tab1.formData,
      };
      console.log("所有tab的提交", bigObj);
      this.sendOrdersSuccess();
    },
    reset_passwords() {
      this.$confirm("确定重置密码吗？", "提示", {
        confirmButtonText: "确定",
        cancelButtonText: "取消",
        type: "warning",
      })
        .then(() => {
          this.$notify.success({
            title: "消息",
            message: "保存成功",
            position: "bottom-right",
          });
        })
        .catch(() => {});
    },
    leave_office() {
      this.$confirm("确定离职吗？", "提示", {
        confirmButtonText: "确定",
        cancelButtonText: "取消",
        type: "warning",
      })
        .then(() => {
          this.$notify.success({
            title: "消息",
            message: "保存成功",
            position: "bottom-right",
          });
        })
        .catch(() => {});
    },
  },
  created() {
    if (this.mode === "addrenyuanxinxi_from") this.title = "新增人员信息";
    if (this.mode === "editrenyuanxinxi_from") this.title = "编辑人员信息";
  },
};
</script>

<style lang="scss" scoped>
.drawerd {
  padding: 0 20px;
}
.btn-stop-use {
  color: #444444;
  background: rgba(192, 192, 192, 1);
  border: 1px solid rgba(176, 177, 177, 1);
}
.btn-sticky {
  text-align: right;
  position: sticky;
  top: 0;
  background-color: #fff;
  z-index: 22;
}
</style>
